<template>
  <view class="content">
    <view class="statistics">
      <view class="ss_title_box">
        <text class="ss_title">HI，很高兴见到你</text>
        <text class="ss_subtitle">请选择您的身份</text>
      </view>
      <view class="select_box">
        <view class="personal" @click="navClick('pages/personal/index')">
          <img class="img" src="../../assets/imgs/personal.png" alt="" />
          <view class="right">
            <text class="ss_text">个人用户</text>
            <text class="ss_subtext">我要找工作，填写求职信息</text>
          </view>
        </view>
        <view class="personal" @click="show = true">
          <img class="img" src="../../assets/imgs/company.png" alt="" />
          <view class="right">
            <text class="ss_text">企业用户</text>
            <text class="ss_subtext">我要招人，登记招聘信息</text>
          </view>
        </view>
         <view class="personal" @click="navClick('pages/position/index')">
          <img class="img1" src="../../assets/imgs/position.png" alt="" />
          <view class="right">
            <text class="ss_text">职位列表</text>
            <text class="ss_subtext">查看招聘职位</text>
          </view>
        </view>
      </view>
    </view>
    <u-popup
      v-model="show"
      mode="center"
      width="500rpx"
      height="280px"
      border-radius="14"
      closeable
    >
      <view class="buttonBox">
        <u-button
          type="primary"
          class="company-item"
          @click="navClick('pages/company/recruit')"
          >全职招聘</u-button
        >
        <u-button
          type="primary"
          class="company-item"
          @click="navClick('pages/company/odd')"
          >零工招聘</u-button
        >
      </view>
    </u-popup>
  </view>
</template>

<script>
export default {
  data() {
    return {
      show: false,
    };
  },
  created() {
    // console.log(this.$route.query);
  },
  onLoad() {
    // alert("window.location.href：" + window.location.href);
    if (window.location.href.includes("userInfo")) {
      var userInfo = this.getQueryUserInfo();
      console.log("userInfo：", userInfo);
      // var openId = userInfo.openid;
      // userInfo = userInfo={"openid":"oTjKM1RdGBF_pFzBCUj1eXxDlJkk","nickname":"???","sex":0,"language":"","city":"","province":"","country":"","headimgurl":"https://thirdwx.qlogo.cn/mmopen/vi_32/Q0j4TwGTfTKJTU9jr88gaic5M8dF7qiaxIVLrY9zrNhB5GUIzyoCZS5icvP1Tu7kJbEbU3gko1rJOIKKicUPB5rdtQ/132","privilege":[]}
      uni.setStorageSync("userInfo", userInfo);
    } else {
      // uni.removeStorageSync("userInfo");
      // window.location.href = "https://5552465i6s.imdo.co/wxmarket/login";
    }
  },
  onShow() {},
  mounted() {},
  computed: {},
  methods: {
    navClick(url) {
      this.show = false;
      this.$u.route({
        url: url,
      });
    },
    getQueryUserInfo() {
      var name = "userInfo";
      var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
      var r = window.location.search.substr(1).match(reg);
      if (r != null) {
        let userInfo = JSON.parse(unescape(r[2]));
        return userInfo;
      } else {
        return null;
      }
    },
  },
};
</script>

<style>
.content {
  width: 100%;
  height: 100%;
  background-image: url("../../assets/imgs/bg.png");
  background-size: 100% 100%;
  /* background-size: contain;
  background-repeat: no-repeat; */
}
.statistics {
  height: 80%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.ss_title_box {
  display: flex;
  flex-direction: column;
}
.ss_title {
  margin-left: 48rpx;
  color: #000000;
  font-size: 48rpx;
  font-family: PingFangSC-Medium, PingFang SC;
  font-weight: 500;
  line-height: 33px;
}
.ss_subtitle {
  margin-left: 48rpx;
  margin-top: 16rpx;
  font-size: 36rpx;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: #60646c;
  line-height: 25px;
}
.select_box {
  display: flex;
  flex-direction: column;
}
.personal {
  margin-top: 70rpx;
  width: 654rpx;
  margin-left: 48rpx;
  display: flex;
  align-items: center;
  height: 240rpx;
  background: #ffffff;
  border-radius: 32rpx;
}
.img {
  margin-left: 40rpx;
  width: 150rpx;
  height: 150rpx;
}
.img1{
  margin-left: 80rpx;
  margin-right: 20rpx;
  width: 90rpx;
  height: 90rpx;
}
.right {
  margin-left: 20rpx;
  display: flex;
  flex-direction: column;
}
.ss_text {
  font-size: 36rpx;
  font-weight: 500;
  color: #000000;
  line-height: 26px;
}
.ss_subtext {
  margin-top: 8rpx;
  font-size: 28rpx;
  font-weight: 400;
  color: #60646c;
  line-height: 22px;
}
.company-item {
  width: 80%;
  margin-top: 55px;
}
.company-item:first-child {
  margin-top: 70px;
}
</style>
